﻿<!DOCTYPE html>
<html>
 <head> 
  <meta charset="UTF-8" /> 
  <title>Table</title> 
  <link rel="stylesheet" href="../webjars/plugins/layui/css/layui.css" media="all" /> 
  <link rel="stylesheet" href="../webjars/css/global.css" media="all" /> 
  <link rel="stylesheet" href="../webjars/plugins/font-awesome/css/font-awesome.min.css" /> 
  <link rel="stylesheet" href="../webjars/css/table.css" /> 
  <style type="text/css">
     .applist{}
     .applist li{
        float:left;width:24%;
     }
  </style>
 </head> 
 <body> 
  <div class="admin-main"> 
   <blockquote class="layui-elem-quote"> 
    <a href="./configs.html" class="layui-btn layui-btn-small"> <i class="layui-icon">&#xe608;</i> 配置列表 </a> 
   </blockquote> 
   <form class="layui-form" action="../admin/cc/config/add">  
     <div class="layui-form-item"> 
     <label class="layui-form-label">全局配置</label> 
     <div class="layui-input-block"> 
      <input type="checkbox" name="global" value="1" lay-skin="switch" lay-text="是|否" /> 
     </div> 
    </div>  
    <div class="layui-form-item"> 
     <label class="layui-form-label">Profile</label> 
     <div class="layui-input-block"> 
       <select id="env" name="env" lay-verify="required" asnycSelect="../admin/profile/options" lay-filter="env_select">
          <option value="">请选择环境</option> 
       </select> 
     </div> 
    </div> 
    <div class="layui-form-item" id="div_app_list"> 
     <label class="layui-form-label">绑定应用</label> 
     <div class="layui-input-block"> 
      <ul id="applist" class="applist" templateLoad="../admin/cc/app/options" template-id="checklist_tpl" onFinishCallback="onFinishCallback"></ul>
        <script type="text/html" id="checklist_tpl">
	     {{# layui.each(d, function(index, item){ }}
          <li><input type="checkbox" name="appName" lay-skin="primary" title="{{ item.text }}" value="{{ item.value }}"></li>
	     {{# }); }}
       </script>
     </div> 
    </div>  
    <div class="layui-form-item"> 
     <label class="layui-form-label">配置类型</label> 
     <div class="layui-input-block"> 
      <input type="radio" name="type" value="1" title="配置文件" checked="" /> 
      <input type="radio" name="type" value="2" title="配置项" /> 
      <input type="radio" name="type" value="3" title="JSON" />
     </div> 
    </div> 
    <div class="layui-form-item">
    <div class="layui-inline">
      <label class="layui-form-label">配置名</label>
      <div class="layui-input-inline" style="width: 200px;">
        <input type="text" id="fileName" name="name" required="" lay-verify="required" placeholder="请输入配置名或者直接上传" autocomplete="off" class="layui-input" style="width:200px;" /> 
      </div>
      <div class="layui-input-inline" style="width: 200px;">
        <input type="file" name="file" lay-title="上传配置文件" class="layui-upload-file">
      </div>
    </div>
    </div>     
    <div class="layui-form-item layui-form-text"> 
     <label class="layui-form-label">配置内容</label> 
     <div class="layui-input-block"> 
      <textarea id="fileContent" name="contents" placeholder="请输入内容" class="layui-textarea"></textarea> 
     </div> 
    </div> 
    <div class="layui-form-item"> 
     <div class="layui-input-block"> 
        <input type="button"  class="layui-btn J_ajaxSubmit"   onSuccessJumpurl="./configs.html" value="保存"/>
        <input type="reset" class="layui-btn layui-btn-primary" value="重置"/>
     </div> 
    </div> 
   </form> 
  </div> 
  <script type="text/javascript" src="../webjars/plugins/layui/layui.js"></script> 
  <script type="text/javascript" src="../webjars/js/common.js?v20170728"></script>  
  <script type="text/javascript">
    layui.use('upload', function(){
    	var $ = layui.jquery;
    	layui.upload({
    	  url: '/admin/cc/config/upload',
    	  method: 'POST',
    	  ext: 'properties|xml|yml',
    	  before: function(input){
    		console.log('文件上传中');
    	  },
    	  success: function(res){
    		if(res.code == 200){
    			$('#fileContent').val(res.data.content);
    			$('#fileName').val(res.data.fileName);
    		}else{
    			layui.layer.msg(res.msg, {icon: 5});
    		}
    	  }
    	}); 
      //
    	$("body").on('click',".layui-form-switch",function() {
    		var $selected = $(this).hasClass('layui-form-onswitch');
    		if ($selected) {
    			$("#div_app_list").hide();
    		} else {
    			$("#div_app_list").show();
    		}
    		//form.render('select');
    	 });
	});
    
    function onFinishCallback(){
  	  layui.form().render();
    }
  </script>
 </body>
</html>